<!DOCTYPE HTML>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <link href="../static/assets3/css/bs3/dpl-min.css" rel="stylesheet" type="text/css"/>
    <link href="../static/assets3/css/bs3/bui-min.css" rel="stylesheet" type="text/css"/>
    <link href="../static/assets/css/page-min.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" type="text/css" href="../admin/css/uploadify.css">
    <link rel="stylesheet" href="../static/layer/skin/default/layer.css" />
</head>
<body>
<div class="container">
    <div class="search-grid-container">
        <div id="grid"></div>
    </div>


    <div id="content" class="hide">
        <form id="J_Form" class="form-horizontal" method="post">
            <input type="hidden" name="id">
            <!--<div class="row">-->
                <!--<div class="control-group span8">-->
                    <!--<label class="control-label"><s>*</s>序号(A/B/C....至多五个)</label>-->

                    <!--<div class="controls">-->
                        <!--<input name="sort" type="text" data-rules="{required:true,maxlength:1}"-->
                               <!--class="input-normal control-text">-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
            <div class="row">
                <div class="control-group span8">
                    <label class="control-label"><s>*</s>答案项</label>

                    <div class="controls">
                        <input name="option" type="text" data-rules="{required:true}"
                               class="input-normal control-text">
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<script type="text/javascript" language="javascript" src="../static/common/jquery.min-2.1.3.js"></script>
<script type="text/javascript" src="../static/layer/layer.js"></script>
<script type="text/javascript" src="../static/assets/js/bui.js"></script>
<script type="text/javascript" src="../static/assets/js/config.js"></script>
<script type="text/javascript" src="../static/common/JsUtil.js"></script>
<script type="text/javascript">
    var qid = __JsUtil.GetQuery("id");
    var title = __JsUtil.GetQuery("q");
    document.title=decodeURI(title)+"选项   ";
    var msg = document.title;
    msg = "…" + msg;pos = 0;
    function scrollMSG() {
        document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
        pos++;
        if (pos >  msg.length) pos = 0
        window.setTimeout("scrollMSG()",400);
    }
    scrollMSG();
    BUI.use(['common/search', 'bui/overlay', 'common/page', 'bui/mask'], function (Search, Grid, Data, Overlay, Mask) {
        var Grid = BUI.Grid, Overlay = BUI.Overlay, editing = new Grid.Plugins.DialogEditing({
                    contentId: 'content', //设置隐藏的Dialog内容
                    triggerCls: 'btn-edit', //触发显示Dialog的样式
                    editor: {
                        width: 400,
                        title: '编辑',
                        success: function () {
                            var edtor = this,
                                    form = edtor.get('form'),
                                    editType = editing.get('editType'),//add 或者 edit
                                    url = "";
                            if (editType == 'add') {
                                url = "../answer/" + qid + "/saveAns";
                            } else if (editType == 'edit') {
                                url = '../answer/updateAns';
                            }
                            //检验
                            form.valid();
                            if (form.isValid()) {
                                layer.load();
                                form.ajaxSubmit({ //表单异步提交
                                    url: url,
                                    success: function (data) {
                                        layer.closeAll('loading');
                                        if (data.hasError) { //返回的数据是 {hasError : fasle,error : 'xxxx',field : 'xxx'},也可以是任意格式的数据如 ： {success : false,'error' : 'xxxxx'}
                                            edtor.close();
                                            BUI.Message.Alert(data.error, 'warning');
                                        } else {
                                            //edtor.accept();
                                            edtor.close();
                                            store.load();
                                        }
                                    },
                                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                                        layer.closeAll('loading');
                                        BUI.Message.Alert("系统繁忙，请稍后" + XMLHttpRequest.status + "," + XMLHttpRequest.readyState + "," + textStatus, 'warning');
                                    }
                                });
                            }
                        }
                    }
                }),
                columns = [
//                    {title: '序号', dataIndex: 'sort', elCls: 'center'},
                    {title: '答案项', dataIndex: 'option', elCls: 'center'},
                    {
                        title: '操作', dataIndex: '', elCls: 'center', renderer: function (value, obj) {
                        var updStr = "<span class=\"grid-command btn-edit\">编辑</span>",
                                delStr = '<span class="grid-command btn-del" title="删除">删除</span>';//页面操作不需要使用Search.createLink
                        return updStr + delStr;
                    }
                    }
                ],
                store = Search.createStore('../answer/listAns', {
                    proxy: {
                        save: { //也可以是一个字符串，那么增删改，都会往那么路径提交数据，同时附加参数saveType
                            /* addUrl : '../data/add.json',*/
                            /* updateUrl : ' ', */
                            /* removeUrl : '../data/del.php' */
                        },
                        method: 'POST'
                    },
                    params : { //配置初始请求的参数
                        qid : qid
                    },
                    pageIndex: 0,
                    pageSize: 10,
                    autoSync: true //保存数据后，自动更新
                }),
                gridCfg = Search.createGridCfg(columns, {
                    forceFit: true,
                    emptyDataTpl: '<div class="centered"><img alt="Crying" src="http://img03.taobaocdn.com/tps/i3/T1amCdXhXqXXXXXXXX-60-67.png"><h2>查询的数据不存在</h2></div>',
                    tbar: {
                        items: [
                            {text: '<i class="icon-plus"></i>新增', btnCls: 'button button-small', handler: addFunction},
                            {
                                text: '<i class="icon-remove"></i>删除',
                                btnCls: 'button button-small',
                                handler: delFunction
                            },
                        ]
                    },
                    plugins: [editing, BUI.Grid.Plugins.CheckSelection, BUI.Grid.Plugins.AutoFit, Grid.Plugins.ColumnResize] // 插件形式引入多选表格
                });

        var search = new Search({
                    store: store,
                    gridCfg: gridCfg
                }),
                grid = search.get('grid');

        editing.on('editorshow', function (ev) {
            var type = ev.editType, //add ,edit
                    record = editing.get('record');
            //alert(type)
            if (type == 'add') {
                //如果马上保存，通过 ev.editType == 'add' 来判断
            } else {
                //alert(JSON.stringify(record));
            }
        });

        function addFunction() {
            var newData = {sort: "A"}; //标志是新增加的记录
            editing.add(newData, 'data'); //添加记录后，直接编辑
        }


        //删除操作
        function delFunction() {
            var selections = grid.getSelection();
            //alert(JSON.stringify(selections));
            delItems(selections);
        }


        function delItems(items) {
            var ids = [];
            BUI.each(items, function (item) {
                ids.push(item.id);
            });
            if (ids.length) {
                BUI.Message.Confirm('确认要删除选中的记录么？', function () {
                    layer.load();
                    $.ajax({
                        url: "../answer/remove",
                        data: {"ids": ids.toString()},
                        dataType: "json",
                        type: "post",
                        async: true,
                        success: function (data) {
                            layer.closeAll('loading');
                            if (data.hasError == false) {
                                store.load();
                            } else {
                                BUI.Message.Alert(data.error, 'warning');
                            }
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            layer.closeAll('loading');
                            BUI.Message.Alert("系统繁忙，请稍后" + XMLHttpRequest.status + "," + XMLHttpRequest.readyState + "," + textStatus, 'warning');
                        }
                    });
                }, 'question');
            } else {
                BUI.Message.Alert("请选择记录", 'warning');
            }
        }

        //监听事件，删除一条记录
        grid.on('cellclick', function (ev) {
            var sender = $(ev.domTarget); //点击的Dom
            if (sender.hasClass('btn-del')) {
                var record = ev.record;
                delItems([record]);
            }
        });

    });
</script>

</html>